<template>
  <div>
    <MyHeader left-color="#a25cf2" right-color="#8100f2"></MyHeader>
    <HeaderBottom left-color="#a25cf2" right-color="#8100f2"
                  left-text="You can just know the website"
                  right-text="About us"/>
    <MyFooter color="#8100f2"/>
  </div>
</template>

<script>
import MyHeader from './componet/MyHeader'
import HeaderBottom from './componet/HeaderBottom'
import MyFooter from './componet/MyFooter'

export default {
  name: 'About',
  components: {MyFooter, HeaderBottom, MyHeader}
}
</script>

<style scoped>
.markdown-body {
  display: flex;
  min-width: 200px;
  max-width: calc(100% - 200px); /* 计算宽度，减去左右间距 */
  margin: 0 auto; /* 自动水平居中 */
  padding-top: 80px;
  padding-left: 100px;
  padding-right: 100px;
}
h1 {
  text-align: center;
}
blockquote {
  background-color: #9172b3;
  color: white;
  padding: 10px;
  width: 1200px;
  border-left: 5px solid #6e549e; /* 左侧矩形边框 */
  margin: 0; /* 重置默认的外边距 */
}

.custom-blockquote p {
  margin: 0; /* 重置默认的段落外边距 */
}
</style>
